<template>
  <div>
    <!--    测试插槽-->
    <div>

     <News>
<!--       <template slot="header">
         <h1>内容一</h1>
       </template>
       <template slot="center">
         <h1>内容二</h1>
       </template>
       <template slot="footer">
         <h1>内容三</h1>
       </template>-->


       <template scope="scopeData">
         <span v-for="m in scopeData.msg" :key="m">{{m}}</span>
       </template>
     </News>

    </div>


    <div>
      <div style="margin-left: 10px;margin-top: 20px">
        <el-cascader :props="props" v-model="value"></el-cascader>

      </div>
      <div style="margin: 50px">
        <span @click="login">微博</span>

      </div>
      <dv-flyline-chart-enhanced :config="config" style="width:600px;height: 600px;margin:100px auto"/>
    </div>

    <div>

    </div>
  </div>
</template>

<script>
import {mapGetters} from 'vuex'
import {config} from '../../assets/js/configs'
import request from "@/utils/request";
import News from '@/components/test/News';

let id = 0;
export default {
  name: 'Dashboard',
  created() {
    if (window.location.href.indexOf("#reloaded") == -1) {
      window.location.href = window.location.href + "#reloaded";
      window.location.reload();
    }
  },

  data() {
    return {
      user:localStorage.getItem("user") ? JSON.parse(localStorage.getItem("user")) : "",
      websocket: null,
      msg: 'helloworld',
      config: config,
      value: [],
      props: {
        lazy: true,
        lazyLoad(node, resolve) {
          const {level} = node;
          let pid = node.value ? node.value : ""

          request.get("/cascader/findAll1?pid=" + pid).then(res => {
            const nodes = res.data.map(item => ({
              value: item.id,
              label: item.name,
              leaf: level == 2
            }));
            resolve(nodes);
          })
        }
      }
    };
  },

  components: {
    News
  },
mounted() {
  if ('WebSocket' in window) {
    this.websocket = new WebSocket('ws://localhost:8880/api/pushMessage/'+this.user.id);
    this.initWebSocket();
  } else {
    alert('当前浏览器不支持WebSocket!!!')
  }
},
  methods: {

    initWebSocket() {
      // 连接错误
      this.websocket.onerror = this.setErrorMessage
      // 连接成功
      this.websocket.onopen = this.setOnopenMessage
      // 收到消息的回调
      this.websocket.onmessage = this.setOnmessageMessage
      // 连接关闭的回调
      this.websocket.onclose = this.setOncloseMessage
      // 监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
      window.onbeforeunload = this.onbeforeunload
    },
    setErrorMessage() {
      window.console.log('WebSocket连接发生错误，状态码：' + this.websocket.readyState)
    },
    setOnopenMessage() {
      window.console.log('WebSocket连接成功，状态码：' + this.websocket.readyState)
    },
    setOnmessageMessage(event) {
      // 根据服务器推送的消息做自己的业务处理
      window.console.log(event.data);
    },
    setOncloseMessage() {
      window.console.log('WebSocket连接关闭，状态码：' + this.websocket.readyState)
    },
    onbeforeunload() {
      this.closeWebSocket()
    },
    closeWebSocket() {
      this.websocket.close()
    },


    login() {
      // window.open("https://api.weibo.com/oauth2/authorize?client_id=2653073160&response_type=code&redirect_uri=http://xptb53.natappfree.cc/weibo/authWeibo")
      request.get("/getUrl").then(res => {
        console.log(res)
        window.open(res.data)
      })
    },
    handleChange(val) {
      console.log(val)

    }
  }
}
</script>

<style lang="scss" scoped>

</style>
